<template>
	<view>
		<view style="height: 80upx;line-height: 80upx;font-size: 32upx;background-color: #FFFFFF;padding: 0 30upx;margin-top: 20upx;"> 
			填写快递单号
		</view>
		<view style="width: auto;height: 100upx;line-height: 100upx;background-color: #FFFFFF;border-bottom: 1upx solid #eeeeee;position: relative;">
			<text style="color: #333333;display: inline-block;margin: 0upx 40upx;">快递公司</text>
			<text style="display: inline-block;margin: 0upx 20upx;" @click="hid_show1">{{kuaidi}}</text>
			<view style="position: absolute;top: 40upx;left: 400upx;background-color: #ffffff;border: 1upx solid #EEEEEE;z-index: 9999;" :style="{display: show_none1}">
				<view v-for="(arr,index) in res" :key=index @click.stop="show_hid1(index)" style="height:50upx;line-height:50upx;color:#888888;font-size: 30upx;padding: 0 30upx;">
					{{arr.name}}
				</view>
			</view>
		</view>
		<view style="width: auto;height: 100upx;line-height: 100upx;background-color: #FFFFFF;border-bottom: 1upx solid #eeeeee;">
			<text style="color: #333333;display: inline-block;margin: 0upx 40upx;">快递单号</text>
			<input style="line-height: 100upx;vertical-align: middle;height: 100upx;line-height: 100upx;display: inline-block;margin: 0upx 20upx; width: 400upx;" placeholder="亲~在这里填写单号哦~~~" placeholder-style="line-height: 100upx;" @input="numIpt" />
		</view>
		<view class="btn">
			<button class="logout" @click="submit">提交快递单号</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				res:[],
				openid: '',
				number: '',
				kuaidi:'圆通速递',
				show_none1:'none',
			};
		},
		onLoad:function(e){
			this.orderid = e.id
			this.refundid = e.refundid
			uni.showLoading()
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					this.openid = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						url: '../../login/login'
					});
				}
			});
		},
		methods:{
			setAjax(){
				uni.request({
					url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=order.refund&app=1',
					method: 'POST',
					data: {
						openid:this.openid,
						id: this.orderid
						},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						this.res = res.data.express_list
						console.log(this.res)
						uni.hideLoading()
					},
					fail: () => {},
					complete: () => {}
				});
				uni.hideLoading()
			},
			submit(){
				var o = this
				uni.request({
					url: 'http://suhua.suzhanxue.com/app/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=order.refund.express&app=1',
					method: 'POST',
					data: {
						openid: this.openid,
						id: this.orderid,
						refundid: this.refundid,
						express: this.kuaidi,
						expresssn: this.number,
						expresscom: this.kuaidi
						},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						console.log(res)
						uni.showToast({
							content: res.data.result.message,
							icon: 'none'
						})
						if(res.data.status == 0) {
							uni.showModal({
								content: res.data.result.message,
							})
							return
						}
						setTimeout(function() {
							uni.reLaunch({
								url: '../detail/detail?id=' + o.orderid
							})
						}, 2000);
						uni.hideLoading()
						this.res = res.data
					},
					fail: () => {},
					complete: () => {}
				});
			},
			hid_show1(){
				console.log(111)
				this.show_none1 = 'block'
			},
			show_hid1(index){
				this.kuaidi = this.res[index].name
				this.show_none1 = 'none'
			},
			numIpt(e){
				this.number = e.detail.value
			},
			jump(e){
				uni.navigateTo({
					url: e.currentTarget.dataset.src
				});
			},
		}
	}
</script>

<style>
	.btn {padding:20upx 0;}
	.btn button {margin:20upx 0;font-size:28upx;padding:12upx;}
	.btn .logout {border-color:#175e3c;background-image: linear-gradient(to bottom, rgb(243, 109, 31), rgb(252, 9, 9));color: #fff;}
</style>
